@font-face {
    font-family: 'Medium';
    src: url('../webfonts/Montserrat-Medium.eot');
    src: url('../webfonts/Montserrat-Medium.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Montserrat-Medium.woff2') format('woff2'),
        url('../webfonts/Montserrat-Medium.woff') format('woff'),
        url('../webfonts/Montserrat-Medium.ttf') format('truetype'),
        url('../webfonts/Montserrat-Medium.svg#Montserrat-Medium') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bold';
    src: url('../webfonts/Montserrat-Bold.eot');
    src: url('../webfonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Montserrat-Bold.woff2') format('woff2'),
        url('../webfonts/Montserrat-Bold.woff') format('woff'),
        url('../webfonts/Montserrat-Bold.ttf') format('truetype'),
        url('../webfonts/Montserrat-Bold.svg#Montserrat-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Regular';
    src: url('../webfonts/Montserrat-Regular.eot');
    src: url('../webfonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Montserrat-Regular.woff2') format('woff2'),
        url('../webfonts/Montserrat-Regular.woff') format('woff'),
        url('../webfonts/Montserrat-Regular.ttf') format('truetype'),
        url('../webfonts/Montserrat-Regular.svg#Montserrat-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Italic';
    src: url('../webfonts/Montserrat-Italic.eot');
    src: url('../webfonts/Montserrat-Italic.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Montserrat-Italic.woff2') format('woff2'),
        url('../webfonts/Montserrat-Italic.woff') format('woff'),
        url('../webfonts/Montserrat-Italic.ttf') format('truetype'),
        url('../webfonts/Montserrat-Italic.svg#Montserrat-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Light';
    src: url('../webfonts/Montserrat-Light.eot');
    src: url('../webfonts/Montserrat-Light.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Montserrat-Light.woff2') format('woff2'),
        url('../webfonts/Montserrat-Light.woff') format('woff'),
        url('../webfonts/Montserrat-Light.ttf') format('truetype'),
        url('../webfonts/Montserrat-Light.svg#Montserrat-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

  @font-face {
    font-family: 'FontAwesome';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../webfonts/fa-solid-900.eot");
    src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), 
    url("../webfonts/fa-solid-900.woff2") format("woff2"), 
    url("../webfonts/fa-solid-900.woff") format("woff"),
    url("../webfonts/fa-solid-900.ttf") format("truetype"),
    url("../webfonts/fa-solid-900.svg#fontawesome") format("svg"); 
}

:root {
    --primary: #001541;
    --secondary: #021f5b;
    --tertiary: #03477e;
    --quaternary: #04589C;
    --quinary: #019fd6;
    --senary: #32caff;
    --white: #FFFFFF;
    --gray: #dcdcdc;
    --light-gray:#EEEEEE;
    --danger: #e72419;
    --rounded: 0.333em;
    --placeholder: #999999;
    --tertiary-hover:#046bbe;
    --quaternary-hover:#01b6f5;
    --danger-hover:#ff0000;
    --brown: #180303;
    --dark-gray: #666666;
    --dark: #02102f;
}

/* ---- preset style START ---- */

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--placeholder);
    opacity: 1
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--placeholder);
    opacity: 1
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: var(--placeholder);
    opacity: 1
}

.form-control::placeholder{
    color: var(--placeholder);
}

html,
body {
    -webkit-text-size-adjust: none;
    margin: 0px;
    padding: 0px;
    /*height: 100%;*/
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    -webkit-overflow-scrolling: touch;
    /* background-image:url('../images/courses-bg.jpg');
    background-position: center bottom;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: 100%; */
}

img {
    border: none;
    margin: 0;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a,
a:link,
a:visited,
a:focus,
input:focus,
textarea:focus {
    outline: none;
    text-decoration: none;
}

select:focus {
    outline: none;
}

textarea {
    resize: none;
}

form,
input,
select,
textarea,
p,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol {
    margin: 0;
    padding: 0;
}

input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

iframe {
    display: block;
}
p+p{
    margin-top: 1em;
}


article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
time {
    display: block;
    margin: 0;
    padding: 0;
}

::selection {
    background: #1C1C1C;
    color: #FFFFFF;
}

::-moz-selection {
    background: #1C1C1C;
    color: #FFFFFF;
}

ul {
    list-style: none;
}

li {
    padding: 0;
    margin: 0;
}

label {
    font-weight: normal !important;
}

.fa-ul>li:not(:last-child) {
    margin-bottom: 15px;
}

.lead {
    font-size: 1.2em;
    line-height: 1.5em;
}

.h1,.h2,.h3,.h4,.h5,.h6,
h1,h2,h3,h4,h5,h6 { font-family: "Medium"; line-height: 1.25em;}

.h1,h1 { font-size: 2.25em; }
.h2,h2 { font-size: 2.000em; }
.h3,h3 { font-size: 1.500em; }
.h4,h4 { font-size: 1.250em; }
.h5,h5 { font-size: 1.154em; }
.h6,h6 { font-size: 1em; }

@media only screen and (max-width: 991px) {
    .h1,h1 { font-size: 2.0em; }
    .h2,h2 { font-size: 1.750em; }
    .h3,h3 { font-size: 1.375em; }
    .h4,h4 { font-size: 1.250em; }
    .h5,h5 { font-size: 1.154em; }
    .h6,h6 { font-size: 1em; }
}

@media only screen and (max-width: 767px) {
    .h1,h1 { font-size: 1.750em; }
    .h2,h2 { font-size: 1.500em; }
    .h3,h3 { font-size: 1.250em; }
    .h4,h4 { font-size: 1.1em; }
    .h5,h5 { font-size: 0.95em; }
    .h6,h6 { font-size: 0.925em; }
}

@media only screen and (min-width: 1601px) {
    section > .minHeight{
        height: 250px;
    }
}

.content .h1,
.content .h2,
.content .h3,
.content .h4,
.content .h5,
.content .h6,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 { margin-top: 28px; margin-bottom: 15px;}

.underlined{
    padding-bottom: .75em;
    margin-bottom: 1em !important;
    text-align:center;
    text-transform: uppercase;
    position: relative;
}

.underlined:after{
    content: "";
    width: 150px;
    height: 5px;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform:translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    background-color: var(--danger);
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
    font-size: 0.8em;
    display: block;
    line-height: 1.5em;
    font-family: "Regular";
}

.table-responsive table thead{
    background: var(--quinary);
    color: #FFF;
}

.table-striped tbody tr:hover,
.table-striped tbody tr{
    background-color: #D9E6FF;
}

.table-striped tbody tr:hover:nth-of-type(2n+1),
.table-striped tbody tr:nth-of-type(2n+1){
    background-color: #B9CCF7;
}

table th, table td{
    vertical-align: middle !important;
}

th,
b,
strong,
.bold {
    font-family: "Bold" !important;
}

em{
    font-family: "Italic" !important;
}

.regular{
    font-family: "Regular" !important;
}

.medium{
    font-family: "Medium" !important;
}

.light{
    font-family: "Light" !important;
}

p:last-child {
    margin-bottom: 0;
}

.stretched {
    letter-spacing: 2px;
}

.text-default:focus,
.text-default:active,
.text-default {
    color: var(--primary) !important;
}

.text-secondary:focus,
.text-secondary:active,
.text-secondary {
    color: var(--secondary) !important;
}

.text-tertiary:focus,
.text-tertiary:active,
.text-tertiary {
    color: var(--tertiary) !important;
}

.text-quaternary:focus,
.text-quaternary:active,
.text-quaternary {
    color: var(--quaternary) !important;
}

.text-white:focus,
.text-white:active,
.text-white {
    color: var(--white);
}

.text-danger:focus,
.text-danger:active,
.text-danger {
    color: var(--danger) !important;
}

.tooltip,
.popover {
    font-family:"Regular";
}

.tooltip-inner{
    font-size: 0.875em;
}

.hoverIcon,
.bgOverlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.bg-white{
    background:var(--white) !important;
}

a.bg-dark:focus,
a.bg-dark:hover,
button.bg-dark:focus,
button.bg-dark:hover,
.bg-dark{
    background:var(--dark) !important;
}

a.bg-primary:focus,
a.bg-primary:hover,
button.bg-primary:focus,
button.bg-primary:hover,
.bg-primary{
    background:var(--primary) !important;
}

a.bg-secondary:focus,
a.bg-secondary:hover,
button.bg-secondary:focus,
button.bg-secondary:hover,
.bg-secondary{
    background:var(--secondary) !important;
}

.bg-tertiary{
    background:var(--tertiary) !important;
}

.bg-quaternary{
    background:var(--quaternary) !important;
}

.bg-quinary{
    background:var(--quinary) !important;
}

.bg-senary{
    background:var(--senary) !important;
}

.bg-danger{
    background:var(--danger) !important;
}

.bg-gray{
    background:var(--light-gray) !important;
}
/* ---- preset style END ---- */

body{
    font-size: 14px;
    font-family: "Regular",Arial, Helvetica, sans-serif;
    line-height: 150%;
    overflow-x: hidden;
    color: var(--primary);
}

body.modal-open{
    overflow: hidden;
    height: 100%;
    position: relative;
}

.container{ max-width: 1200px;}
.main{
    overflow-x: hidden;
    width: 100%;
    padding-top: 170px;
}

.navbar-brand img{
    /*width: 190px;*/
    width: 320px;
}

.navbar-brand .logo-primary{
    display: none;
}

@media (min-width: 1200px) {
    .navbar-brand {
        position: absolute;
        top: 0px;
        /*background: var(--primary);*/
        background: #0c2340;
        padding: 10px 15px;
        /*-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25);
        -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25);
        box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25);*/
    }
    
    .navbar-brand img.logo-primary{
        width: 125px;
    }

/*    .navbar-brand.logoChange img.logo-primary{
        display: block;
    } 
    .navbar-brand.logoChange img.logo-secondary{
        display: block !important;
    }
*/  
    .navbar-brand img.logo-primary{
        display: none !important;
    }
    .navbar-brand img.logo-secondary{
        display: block !important;
    }
}

#primaryNav{ min-height: 90px; background: #0c2340 !important; }
#topNav { background: #0c2340 !important; }

#topNav .dropdown-item,
#primaryNav .nav-link,
#primaryNav .dropdown-item,
#primaryNav .dropdown-submenu {
    position: relative;
    font-size: 13px;
    color: var(--white);
    font-family: "Medium", Arial, Helvetica, sans-serif;
    white-space: normal;
}

#primaryNav .nav-link[aria-expanded="true"],
#primaryNav .nav-link:focus,
#primaryNav .nav-link:active,
#primaryNav .nav-link.active,
.dropdown-item.active{
    color: var(--danger) !important;
    background:transparent;
}

@media only screen and (min-width: 768px) {
    #primaryNav .nav-link:hover{
        color: var(--danger) !important;
    }
}

#primaryNav .dropdown-menu > li.dropdown-submenu a.nav-link,
#topNav .dropdown-item,
#primaryNav .dropdown-item {
    padding-top: 0.50em;
    padding-bottom: 0.50em;
}

#primaryNav .dropdown-menu li:not(:last-child) .dropdown-item,
#primaryNav .dropdown-menu li.dropdown-submenu:not(:last-child){
    /*border-bottom: 1px solid var(--tertiary);*/
    border-bottom: 1px solid rgba(255,255,255,0.4);
}

#topNav .dropdown-item:active,
#topNav .dropdown-item:focus,
#topNav .dropdown-item:hover,
#primaryNav .dropdown-item:active,
#primaryNav .dropdown-item:focus,
#primaryNav .dropdown-item:hover{
    background: var(--tertiary) !important;
}

#topNav .dropdown-menu,
#primaryNav .dropdown-menu{
    font-size: 1em;
    background: var(--secondary);
    padding: 0;
    border-radius: 0;
    min-width: 240px;
    margin-top: 0;
}


#primaryNav .dropdown-submenu>a:after {
    content: "\f105";
    position: absolute;
    border: none;
    right: 20px;
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    text-transform: none;
}

#primaryNav .dropdown-submenu>a.dropdown-item{
    width: auto !important;
}

.dropdown-toggle::after{
    content: "\f107";
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    border: none;
    vertical-align:unset;
    font-size: 1em;
    color: var(--white);
    text-transform: none;
}

@media (min-width: 1200px) {
    .dropdown:hover>.dropdown-menu {
        display: block;
    }

    .dropdown-submenu:hover >.dropdown-menu{
        display: block;
    }
}

.nav-link + .dropdown-toggle{
    position: absolute !important;
    padding: 5px 10px !important;
    right: 10px;
    top:6px;
    border: none !important;
}

#primaryNav .dropdown-submenu>.dropdown-menu {
    top:0 ;
    left: 100%;
    margin-top: 0px;
    margin-left: 0px;
    
}

#primaryNav .dropdown-submenu.top>.dropdown-menu{
    top:auto;
    bottom: 0;
}

#primaryNav li.dropdown-submenu .dropdown-menu-right{
    left: auto;
    right:100%;
}

#primaryNav .dropdown-submenu>a.nav-link{
    padding-left: 1.5rem;
}

#primaryNav .dropdown-submenu>a.nav-link{
    padding-left: 1.5rem;
}

.nav-item.dropdown > .nav-link{
    position: relative;
    display: inline-block;
    padding-right: 18px !important;
}

.nav-item.dropdown > .nav-link:after{
    content: "\f107";
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    position: absolute;
    right: 5px;
    top:8px;
}

.bordeRight{ position:relative;}
/* .bordeRight::after{
    content: "";
    width: 1px;
    background: var(--gray);
    right: 0;
    height: 50%;
    top:50%;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    position:absolute;
} */

.bordeRight::after{
    content: "";
    width: 1px;
    background: var(--gray);
    right: 0;
    height: calc(100% - 45px);
    bottom:0.5rem;
    position:absolute;
}

@media (max-width: 767px) {
    .bordeRight::after{
        display: none; 
    }
    .navbar-brand img { width: 250px; }
}
@media (max-width: 1199px) {
    .nav-item.dropdown > .nav-link:after{
        content: "";
    }
        
    #primaryNav .dropdown-submenu>a.nav-link::after{
        content: none;    
    }

    #primaryNav{
        min-height: 80px;
    }

    #primaryNav .navbar-nav{
        overflow-y: auto;
        max-height: 400px;
    }

    
    #primaryNav .dropdown-submenu>a:after {
        content: "\f107";
        position: unset;
    }

    #primaryNav .dropdown-item + .dropdown-menu li a.dropdown-item{
        padding-left: 50px;
    }

    #primaryNav .dropdown-item + .dropdown-menu{
        background: var(--quaternary);
    }

    #primaryNav .navbar-nav > li:not(:last-child){
        border-bottom: 1px solid var(--tertiary);
    }

    #primaryNav .nav-link{
        padding: 1em;
    }

    /* #primaryNav .nav-item > .dropdown-toggle {
        background: rgba(255,255,255,0.5);
    } */

    #primaryNav .dropdown-toggle::after{
        font-size: 1.2rem;
    }

    #primaryNav .dropdown-item:active,
    #primaryNav .dropdown-item:focus,
    #primaryNav .dropdown-item:hover{
        background: none !important;
    }
}

/*END OF PRIMARY NAVIGATION */

.form-control {
    border-radius: 0;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-appearance: none;
    font-size: 1em;
    font-family: "Regular";
}

.select2-container--bootstrap4 .select2-selection{
    border-radius: 0;
}

.select2-container--bootstrap4 .select2-selection--single{
    height: 2.2rem !important;
}

.content ul.select2-selection__rendered{
    margin: 0 !important;
}

.content ul.select2-selection__rendered li{
    list-style: none !important;
}
.form-group{
    margin-bottom: 1.5em;
}
.form-group label{
    font-family: 'Medium';
    font-size: 0.925em;
    margin-bottom: 0.25em;
}

.form-group label.required{ position: relative;}

.form-group label.required:after{
    content: "*";
    position: absolute;
    padding-left:3px;
    font-size: 1.5em;
    color:var(--danger);
}

.btn{
    -webkit-appearance: none;
    border-radius: 0;
    /* white-space: nowrap; */
    font-family: "Medium";
    text-transform: uppercase;
    /* color: var(--white) !important; */
    /* border: none; */
    padding-left: 1.5em;
    padding-right: 1.5em;
}

@media (min-width: 768px) {
    .btn+.btn{
        margin-left: 15px;
    }

    .announcement .btn+.btn{
        margin-left: 3px;
    }
}
@media (max-width: 767px) {
    .flex-column .btn+.btn{
        margin-top: 1em;
    }
}

/* .btn:hover{
    color: var(--white);
} */


.btn-primary{
    background: var(--primary) !important;
    color: var(--white) !important;
    border: none !important;
}

.btn-secondary{
    background: var(--secondary) !important;
    color: var(--white) !important;
    border: none !important;
}

.btn-tertiary:focus,
.btn-tertiary:active,
.btn-tertiary{
    background: var(--tertiary) !important;
    color: var(--white) !important;
    border: none !important;
}

.btn-quaternary{
    background: var(--quaternary) !important;
    color: var(--white) !important;
    border: none !important;
}

.btn-quinary{
    background: var(--quinary) !important;
    color: var(--white) !important;
    border: none !important;
}
.btn-danger{
    background: var(--danger) !important;
    min-width: 110px;
    text-align: center;
    color: var(--white) !important;
    border: none !important;
}

.input-group-text{border-radius: 0;}

.btn-tertiary:hover{
    background: var(--tertiary-hover) !important;
}

.btn-quaternary:hover{
    background: var(--quaternary-hover) !important ;
}

.btn-quinary:hover{
    background: var(--senary) !important ;
}
.btn-danger:hover{
    background: var(--danger-hover) !important ;
}


/*TOP NAVIGATION*/
/* #topNav{
    z-index: 1031;
} */

@media (max-width: 767px) {
    #topNav #search-block-form{
        width: 100% !important;
    }
}

.searchBox,
#topNav .btn{
    height: 35px;
    font-size: 0.875em;
    line-height: 35px;
    padding: 0 1em;
    box-shadow: none;
    margin-left: 0;
}

.searchBox{
    font-size: 0.875em;
    border: none;
    background: var(--gray);
    border-radius: 0;
}
.searchBox + .input-group-append{
    position: absolute;
    right: 0;
    height: 100%;
}

.searchBox + .input-group-append button{
    border: none;
    background: var(--gray) !important;
    outline: none;
}

@media (max-width: 767px) {
    #topNav{
        padding-top: 0.5em;
        padding-bottom: 0.5em;
    }
    .input-group.w-auto,
    .searchBox{
        width: 100% !important;
    }

    #topNav a.btn{
        padding-left: 1.5em;
        padding-right: 1.5em;
    }

    
}

/*END TOP NAVIGATION*/



/*ANIMATED HUMBURGER ICON*/

#hamburgerButton{
    outline: none;
}

.hamburger {
    width: 30px;
    height: 20px;
    position: relative;
    margin: 0px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}

.hamburger span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

.hamburger span {
    background: var(--white);
}

.hamburger span:nth-child(1) {
    top: 0px;
}

.hamburger span:nth-child(2) {
    top: 10px;
}

.hamburger span:nth-child(3) {
    top: 20px;
}

.hamburger.open span:nth-child(1) {
    top: 11px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
    background: var(--danger);
}

.hamburger.open span:nth-child(2) {
    opacity: 0;
    left: -60px;
    background: var(--danger);
}

.hamburger.open span:nth-child(3) {
    top: 11px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    background: var(--danger);
}
/*END OF ANIMATED HUMBURGER ICON*/

/*SLIDER BANNER*/
.staticBanner300,
.staticBanner,
.bgCover,
.slideElement {
    position: relative;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    display: block !important;
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .slideElement {
        background-position: center right;
    }
}

@media only screen and (max-width: 1599px) {
    .overlaid .slideElement {
        background-position: bottom center;
    }
}

.slideElement aside {
    position: absolute;
    color: #FFF;
    z-index: 1;
    top: 50%;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    width: 100%;
}

.slideElement aside strong.title,
.slideElement aside h1,
.slideElement aside p{
    text-shadow: 0 0 2px #1c1c1c;
    margin-bottom: 20px;
    font-family: "Light";
}

.staticBanner300 aside h1{
    margin: 0;
}

.slideElement aside strong.title{
    display: block;
    font-size: 2.25em;
    line-height: 1.25em;
}

.overlaid .slideElement aside {
    top: 45%;
}

.staticBanner{
    padding-top: 6em;
    padding-bottom: 6em;
    color: var(--white);
    
}

.staticBanner .container{
    position: relative;
    z-index: 1;
}

.staticBanner .title,
.staticBanner p,
.staticBanner .heading{
    margin-bottom: 2em;
}

.staticBanner300 {
    height: 600px;
}

.slideH300 .slideElement {
    height: 300px;
    overflow: hidden;
}

.slideH400 .slideElement {
    height: 400px;
    overflow: hidden;
}

.slideH650 .slideElement {
    height: 650px;
    overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
    
    .overlaid .slideElement aside{
        padding-left: 5em;
        padding-right: 5em;
    }
}
@media screen and (min-width: 576px) and (max-width: 991px) {
    .modal-dialog{
        max-width: 90% !important;
    }
}

@media only screen and (min-width: 768px) {
    

    .overlaid .slideElement{
        background-size: 60%;
        background-position: right;
        background-color: #00233f !important;
    }
}

@media only screen and (max-width: 767px) {

    .staticBanner300 {
        height: 200px;
    }

    .slideH300 .slideElement {
        height: 200px;
    }

    .slideH400 .slideElement {
        height: 330px;
    }

    .slideH650 .slideElement {
        height: 400px;
    }

    .overlaid .slideElement aside {
        top: 50%;
    }

    .imageTextBelow.staticBanner300,
    .imageTextBelow.staticBanner,
    .imageTextBelow .slideElement{
        background-image: none !important;
        height: auto;
        background: var(--secondary);
        padding: 0;
    }

    .imageTextBelow.staticBanner300 aside,
    .staticBanner .container,
    .imageTextBelow .slideElement aside{
        position: relative;
        transform: none;
        left: unset;
        top: unset;
        padding-top: 2em;
        padding-bottom: 2em;
    }

    .imageTextBelow .slideElement aside{
        padding-bottom: 5em;
    }

    .staticBanner .container h1,
    .imageTextBelow.staticBanner300 aside h1,
    .slideElement aside strong.title,
    .imageTextBelow .slideElement aside h1{
        font-size: 1.2em;
    }

    .imageTextBelow.staticBanner300 aside{
        padding-top: 1em;
        padding-bottom: 1em;
    }
}


.slick-dots {
    position: absolute;
    z-index: 0;
    width: 100%;
    bottom: 40px;
    left: 0;
    text-align: center;
    padding: 0;
    -webkit-appearance: none;
}

.slick-dots li {
    cursor: pointer;
    display: inline-block;
    margin: 0 5px;
    padding: 0;
    position: relative;
    width: 10px;
    height: 10px;
    -webkit-appearance: none;
}

.slick-dots li span {
    display: block;
    width: 10px;
    height: 10px;
    text-indent: -9999px;
    margin: 0 auto;
    background: var(--light-gray);
    -webkit-appearance: none;
}

.slick-dots li.slick-active span,
.slick-dots li.slick-active span:hover,
.slick-dots li span:hover {
    background: var(--white) !important;
    position: relative;
    -webkit-appearance: none;
}

.btnNext,
.btnPrev,
.btnNext:active,
.btnPrev:active,
.btnNext:focus,
.btnPrev:focus {
    width: 35px;
    height: 35px;
    right: 20px;
    position: absolute;
    top: 50%;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    color: var(--primary);
    z-index: 1;
    text-align: center;
    background: var(--light-gray);
    border-radius: 50%;
    -webkit-appearance: none;
}

.btnNext i,
.btnPrev i {
    position: absolute;
    top: 3px;
    right: -3px;
    left: 0;
    bottom: 0;
}

.btnPrev {
    left: 20px;
}

.btnPrev i {
    right: 3px;
}

.arrowOutside .btnPrev {
    left: -10px;
}

.arrowOutside .btnNext {
    right: -10px;
}

@media only screen and (min-width: 1300px) {
    .arrowOutside .btnPrev {
        left: -40px;
    }

    .arrowOutside .btnNext {
        right: -40px;
    }

    
}

@media only screen and (min-width: 1700px) {
    .overlaid .btnPrev {
        left: 200px !important;
    }
    .overlaid .btnNext {
        right: 200px !important;
    }
}

@media only screen and (min-width: 1920px) {

    .overlaid .btnPrev {
        left: 300px !important;
    }
    .overlaid .btnNext {
        right: 300px !important;
    }
}

.btnPrev.slick-disabled,
.btnNext.slick-disabled {
    opacity: 0.1;
    cursor: not-allowed;
}

.slideShow,
.thumbnailTabsContent,
.thumbnailTabs{
    opacity: 0;
}

.slick-slider.slick-initialized{
    opacity: 1;
    display: block;
}

.slideShow.overlaid .slick-dots {
    bottom: 130px;
}

@media only screen and (max-width: 991px) {
    .arrowOutside .btnPrev {
        left: 0;
        background: rgba(255, 255, 255, 1);
    }

    .arrowOutside .btnNext {
        right: 0;
        background: rgba(255, 255, 255, 1);
    }
}

@media only screen and (max-width: 767px) {

    .slideShow.overlaid .slick-dots {
        bottom: 20px;
    }

    .btnNext i,
    .btnPrev i {
        top: 4px;
    }

    

}
@media only screen and (max-width: 575px) {
    .arrowOutside .btnPrev {
        left: 0;
    }

    .arrowOutside .btnNext {
        right: 0;
    }
}

.btnNext:hover,
.btnPrev:hover {
    background: var(--white);
    color: var(--primary);
}

.bannerBoxes{
    margin-top: -100px;
    z-index: 1;
    height: 250px;
    position: relative;

}

.bannerBoxItem:before{
    /*background: var(--secondary);*/
    background: #0c2340;
    /*padding-top: 200px !important;*/
    padding-top: 250px !important;
}

.bannerBoxItem{
    border: 3px solid var(--gray);
}
.careerPath{
    margin-top: -100px;
    padding-top: 100px;
}

.careerSlider .slick-slide.slick-center{
    z-index: 1;
    position: relative;
}
.careerSlider .slick-slide:not(.slick-center){
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
}

.careerSlider .shadow{
    /*box-shadow: 0 .1rem 1rem rgba(0,0,0,.1) !important;*/
    box-shadow: none !important;
}
/* 
.careerSlider .slick-slide div:before{
    content: "";
    position: absolute;
    top: -30px;
    width: calc(100% - 60px);
    height: 100%;
    left: 30px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("../images/career-item_01.png");
    border-radius: 2em;
    z-index: -1;
} */

.hvr-grow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.hvr-grow-center,
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    z-index: 1;
}

.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
    z-index: 2;
}

.hvr-glow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow;
    transition-property: box-shadow;
  }
  .hvr-glow:hover, .hvr-glow:focus, .hvr-glow:active {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  }

@media (min-width: 768px) {
    .bannerBoxItem:hover:before{
        background: var(--tertiary);
    }

    .hvr-grow-center:before{
        background: var(--tertiary) !important;
    }

    .bannerBoxItem span br{
        /*display: none;*/
    }
}



@media (max-width: 767px) {
    .bannerBoxes{
        margin-top: 0;
        height: unset;
        background: var(--primary);
        padding-top: 1em;
        padding-bottom: 1em;
    }
    .careerPath{
        margin-top: 0;
        padding-top: 0;
    }

    .hvr-grow-center,
    .hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active{
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    .VideoBG {
        height: auto !important;
        margin-top: 0px !important
    }
    .slick-slider {
       /* background: #0c2340;*/
    }
    .slideShow {
        margin-top: auto !important;    
    }
    .deskOn {
        display: none;
    }
    .careerSlider {
        margin-right: auto !important;
        margin-top: 10px !important;
    }
}
/*END OF SLIDER BANNER*/

/*NEWS TICKER*/

.newsTickerItem {
    font-family: "Medium";
    font-size: 0.9em;
    color: var(--primary);
    white-space: nowrap;
    display: block;
    overflow: hidden;
}

marquee{ display:block; padding-top: 5px;}

.newsTicker{
    position: relative;
    display: none;
}
.newsTicker .btnNext,
.newsTicker .btnPrev{
    color: var(--primary);
    background: none;
}

.newsTicker .btnNext,
.newsTicker .btnPrev{
    color: var(--primary);
    position: absolute;
    right: -60px;
    top: 50%;
    z-index: 1;
    padding: 0 10px;
    font-size: 1.5em;
}

.newsTicker .btnNext i,
.newsTicker .btnPrev i {
    top: 6px;
}

.newsTicker .btnPrev{
    right: -30px;
    left: unset;
}

@media (max-width: 991px) {
    .newsTicker .btnNext,
    .newsTicker .btnPrev{
        top:50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

    .newsTicker .btnNext{
        right: -20px;
    }

    .newsTicker .btnPrev{
        right: unset;
        left: -20px;
    }
}

@media (max-width: 767px) {
    .newsTickerItem {
        padding-left: 1.5em;
        padding-right: 1.5em;
    }    
}

.announcement{
    position: fixed;
    top: 125px;
    z-index: 1001;
    left: 0;
    width: 100%;
}
@media (max-width: 400px) {
    .announcement .btn-sm{
        font-size: .75em;
        margin-bottom: 3px;
        min-width: 80px;
    }
}

@media (max-width: 1199px) {
    body .main{
    padding-top: 165px;
    }

    .announcement{
    top:122px;
    }
}

@media (max-width: 991px) {
    body .main{
    padding-top: 120px;
    }

    .announcement{
        position: relative;
        top:unset;
    }
}

@media (max-width: 767px) {
    /* body{
        padding-top: 225px;
    }

    .announcement{
        position: relative;
        top:135px;
    } */
    
    body .main{
        padding-top: 135px;
    }
}

/*END OF NEWS TICKER*/

/*NEWS ITEM*/
.timelineItem aside,
.newsItem aside{
    height: 225px;
}

.timelineItem aside{
    height: 180px;
}

.timelineItem aside .content,
.newsItem aside .content{
    height:3em;
    overflow: hidden;
}

.newsItem aside .btn{
    width: 150px !important;
}

/*END OF NEWS ITEM*/

/*EVENTS ITEM*/
.eventsItem{ background: var(--brown) ;}
.eventsItem aside{
    height: 140px;
}
.eventsItem aside .btn {
    width: 150px !important;
}
/*END OF EVENTS ITEM*/

/*EVENTS ITEM*/
.homeVideo,
.videoItem{ position: relative; display: block !important;}
.homeVideo aside,
.videoItem aside{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    bottom: 60px;
}

@media (max-width: 575px) {
    .homeVideo aside,
    .videoItem aside{
        position: relative !important;
        bottom: unset;
        left: unset; 
        right: unset; 
        bottom: unset; 
        background: var(--primary);
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }

    .videoItem aside{
        font-size: 0.75em;
    }
}
/*END OF EVENTS ITEM*/


/*FOOTER*/

.signup{
    background-color: #123b93;
    background-image: url('../images/open-day.png');
    background-position: right center;
    background-repeat: no-repeat;
    background-size:contain;
}

.signup h3 { font-size: 2.25em;}
@media only screen and (max-width: 991px) {
    .signup h3 { font-size: 2.0em; }
}

@media only screen and (max-width: 767px) {
    .signup h3 { font-size: 1.750em; }
}

@media (max-width: 575px) {
    .signup{
        background-image: none !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .py-160 {
        background: linear-gradient(0deg, rgba(0, 21, 66, 1.0), rgba(0, 21, 66, 1.0)) !important;
    }
    .d-flex-deskon {
        display: flex;
    }

}
footer,
footer a{
    color: var(--white);
}
.footer{
    /*background-image: url("../images/footerbknd.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: var(--primary);*/
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.95), rgba(0, 21, 66, 0.95)), url(/sites/default/files/2022-04/uowd-campus-external-img-v2.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

footer .logo{
    margin-bottom: 1.286em;
}

footer span{
    margin-bottom: 1.2em;
    font-family: "Medium";
    line-height: 1.25em;
    display: block;
    font-size: 0.925rem;
}

footer p + span,
footer p > span{
    margin-top: 2em;
}


footer p, footer a{
    font-size: 80%;
}

footer p a{
    font-size: 1em;
}

footer a:hover{
    color: var(--white);
    text-decoration: underline;
}

.socialMedia li a>i[class*="facebook"]:hover{ color: #3E5B99; }
.socialMedia li a>i[class*="twitter"]:hover{ color: #1DA1F2; }
.socialMedia li a>i[class*="instagram"]:hover{ color: #0095F6; }
.socialMedia li a>i[class*="linkedin"]:hover{ color: #0077B5; }
.socialMedia li a>i[class*="youtube"]:hover{ color: #FF0000; }
.socialMedia li a>i[class*="vk"]:hover{ color: #2787F5; }

.bottomFooter{
    background: var(--secondary);
    text-align: center;
    padding:1em;
}

@media (max-width: 767px) {
    .bottomFooter{
        text-align: left;
        padding-right: 80px;
        padding-left: 10px;
    }
}

.withSeparator li{
    position: relative;
    padding: 0 .5em;
}
.withSeparator li:not(:last-child):after{
    content: "";
    width: 1px;
    position: absolute;
    right: -.5em;
    height: .75em;
    top: 50%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    background: var(--gray);
}

@media (max-width: 991px) {
    footer span{
        margin-top: 2em;
        margin-bottom: 1.2em;
    }
}


/*END OF FOOTER*/

/*GENERAL*/

.bg-cover,
.bg-cover-absolute {
    position: relative;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.bg-cover-absolute {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.rectangleBox{
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: 80%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.textOverImage:hover .grow,
.profileBox:hover .grow,
.timelineItem:hover .grow,
.eventsItem:hover .grow,
.newsItem:hover .grow,
.rectangleBox:hover>.grow {
    -moz-transform: scale(1.04);
    -ms-transform: scale(1.04);
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
}

.quaternaryBox,
.whiteBox,
.primaryBox,
.secondaryBox,
.tertiaryBox,
.quaternaryBox,
.dangerBox{
    margin-bottom: 1.65em;
    background: var(--primary);
    color: var(--white);
}

.secondaryBox{ background: var(--secondary); }
.tertiaryBox{ background: var(--tertiary); }
.quaternaryBox{ background: var(--quaternary); }
.dangerBox{ background: var(--danger); }


.thumbnailTabs .quaternaryBox{
    margin-bottom: 15px;
}

.thumbnailTabs h6{
    font-size: 0.85em;
}

.whiteBox{
    background: var(--white);
}

.modal-dialog .relatedfields .tertiaryBox.embed-responsive-1by1 h6,
.whiteBox.embed-responsive-1by1 h6{
    /* before the alignment issue
    margin-bottom: 0;
    font-size: 0.95em;
    */
    margin-bottom: 0;
    font-size: 0.95em;
    margin-top: 10px !important;
}

.slick-slide .thumbItem,
.relatedfieldsSlider .whiteBox,
.relatedDegreesSlider .primaryBox{
    margin: 0;
}

.thumbnailTabsContent .embed-responsive-21by9::before{
    padding-top: 30%;
}

.thumbnailTabsContent [aria-orientation="vertical"] a{
    color: var(--white);
    border-radius: 0;
    margin-bottom: 3px;
    position: relative;
}

.thumbnailTabsContent.slick-slider .slick-track, .thumbnailTabsContent.slick-slider .slick-list{
    height: auto !important;
}

.thumbnailTabsContent [aria-orientation="vertical"] a:last-child{
    margin-bottom:0;
}

.thumbnailTabsContent [aria-orientation="vertical"] a.active:after{
    content: "";
    position: absolute;
    width: 0; 
    height: 0; 
    border-left: 15px solid red;
    border-bottom: 10px solid transparent;
    border-top: 10px solid transparent;
    z-index: 1;
    right: -15px;
    top: 50%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.thumbnailTabsContent [aria-orientation="vertical"] a.active.bg-primary:after{ border-left-color: var(--primary);}
.thumbnailTabsContent [aria-orientation="vertical"] a.active.bg-secondary:after{border-left-color: var(--secondary);}
.thumbnailTabsContent [aria-orientation="vertical"] a.active.bg-tertiary:after{border-left-color: var(--tertiary);}
.thumbnailTabsContent [aria-orientation="vertical"] a.active.bg-quaternary:after{border-left-color: var(--quaternary);}

.whiteBox .embed-responsive-item,
.primaryBox .embed-responsive-item,
.secondaryBox .embed-responsive-item,
.tertiaryBox .embed-responsive-item,
.quaternaryBox .embed-responsive-item,
.dangerBox .embed-responsive-item{
    padding: 0.5em;
    text-align: center;
}

/* before the alignment issue */
/*Brendon Version*/
/* .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item, */
/*Brendon Version*/
/* .thumbnailTabs .quaternaryBox .embed-responsive-item, */
/* .modal-dialog .relatedfields .tertiaryBox .embed-responsive-item{
    display: block !important; 
} */

.thumbnailTabs .quaternaryBox .embed-responsive-item span[class*="fac-"] {
    height: 50px;
}
/*Brendon Version*/
.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]:before{ font-size: 1em; }

.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img + h6,
.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"] + h6{
    position: absolute;
    display: block;
    text-align: center;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 30%;
    margin: 0;
    padding: 0 8px;
}

.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ margin: auto; }
@media only screen and (min-width:320px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 56px; }
}

@media only screen and (min-width:400px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 60px; }
}

@media only screen and (min-width:450px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 90px; }
}

@media only screen and (min-width:575px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 130px; }
}

@media only screen and (min-width:700px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 180px; }
}

@media only screen and (min-width:768px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 100px; }
}

@media only screen and (min-width:1200px) {
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{ font-size: 98px; }
}
@media only screen and (max-width: 1280px) and (min-width: 1150px) {
    .VideoBG {   height: 650px !important;   margin-top: -50px !important;   }
    #topNav .dropdown-item, #primaryNav .nav-link, #primaryNav .dropdown-item, #primaryNav .dropdown-submenu { font-size: 11px !important; line-height: 18px !important; }
    #primaryNav .dropdown-menu > li.dropdown-submenu a.nav-link, #topNav .dropdown-item, #primaryNav .dropdown-item { padding-top: 0.2em; padding-bottom: 0.2em; }
    #primaryNav .dropdown-submenu>.dropdown-menu { top: -10px !important; }
}
/*Brendon Version*/
@media only screen and (max-width: 1128px) and (min-width: 800px) {
    .VideoBG { height: 580px !important;    margin-top: 0px !important; }
    body .main { padding-top: 120px;  }
    .careerPath { margin-top: -106px;  }
    .widgetBtnSpc {  min-height: auto !important; }
}
@media only screen and (max-width: 1600px) and (min-width: 1300px) {
    .VideoBG {    height: 850px !important; margin-top: -180px !important; }  
    .careerPath { margin-top: -106px;  }
    #topNav .dropdown-item, #primaryNav .nav-link, #primaryNav .dropdown-item, #primaryNav .dropdown-submenu { font-size: 11px !important; }
    #primaryNav .dropdown-menu > li.dropdown-submenu a.nav-link, #topNav .dropdown-item, #primaryNav .dropdown-item { padding-top: 0.2em; padding-bottom: 0.2em; }
    #primaryNav .dropdown-submenu>.dropdown-menu { top: -10px !important; }
}

@media only screen and (max-width:575px) {
    .thumbnailTabs .quaternaryBox .embed-responsive-item span[class*="fac-"] {
        font-size: 6em;
    }   


    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img + h6,
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"] + h6{
        padding: 0;
    }

}

.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img,
.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item [class*="fac-"]{
    padding-bottom: 30px;
}
.row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img{
    width: 45%;
}

@media only screen and (max-width:440px) {
    .thumbnailTabs .quaternaryBox .embed-responsive-item span[class*="fac-"] {
        font-size: 2.5em;
        height: 40px
    }   
 
    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img + h6{
        height: 35%;
    }

    .row-cols-xl-5 .embed-responsive-1by1 .embed-responsive-item img{
        padding-bottom: 50px;
    }

}

/* before the alignment issue */

a.blockLink {
    overflow: hidden;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 2;
}

a.blockLink i{
    position: absolute;
    color: var(--white);
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    z-index: 2;
}

.primaryBox:hover{
    background: var(--tertiary);
}
.primaryBox:hover{ background: var(--tertiary); }
.secondaryBox:hover{ background: var(--quaternary); }
.tertiaryBox:hover{ background: var(--tertiary-hover); }
.quaternaryBox:hover{ background: var(--quaternary-hover); }
.dangerBox:hover{ background: var(--danger-hover); }

.primaryBox img{ width: 80px;}
.primaryBox.bg-secondary img{ width: 120px;}

@media (max-width: 575px) {
    .primaryBox img{ width: 75px;}
    .primaryBox.bg-secondary img{ width: 75px;}
}

.whiteBox .fa-5x{
    color: var(--primary);
}

@media (max-width: 420px) {
    .whiteBox .fa-5x,
    .primaryBox .fa-5x,
    .secondaryBox .fa-5x,
    .tertiaryBox .fa-5x,
    .quaternaryBox .fa-5x,
    .dangerBox .fa-5x{
        font-size: 3.5em;
    }
}


.grow,
.timelineItem aside,
.slick-dots li span,
.btn,
.quaternaryBox,
.whiteBox,
.primaryBox,
.secondaryBox,
.tertiaryBox,
.quaternaryBox,
.dangerBox,
.bannerBoxItem:before,
.slick-slide,
.hoverIcon i,
a.blockLink i,
.videoItem::before,
a {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

/*BREADCRUMBS*/
.breadCrumbs{   
    font-size: 0.9em;
    border-bottom: 1px solid var(--gray);
    color: var(--danger);
    font-family: "Medium";
}

.breadCrumbs li{
    position: relative;
    padding-right: 1em;
}

.breadCrumbs li:not(:last-child):after{
    content: "\f105";
    position: absolute;
    right: -2px;
    top:1px;
    font-family: 'Font Awesome 5 Free', 'FontAwesome';
    color: var(--primary);
    text-transform: none;
}

.breadCrumbs li a{
    color:var(--primary)
}
.breadCrumbs li a:hover,
.breadCrumbs li a.active{
    color: var(--danger);
}
/*END OF BREADCRUMBS*/


/*TIMELINE SLIDER*/
.timelineItem .rectangleBox{
    padding-top: 90%;
}

.slick-slide:nth-child(odd) .timelineItem aside{
    background: var(--quaternary);
}

.slick-slide:nth-child(even) .timelineItem aside{
    background: var(--tertiary);
}

.timelineItem:hover aside{
    background: var(--secondary) !important;
}

.projectNavSlider::before,
.timelineNavSlider::before{
    content: "";
    position:absolute;
    top: 25px;
    width: 100%;
    height: 1px;
    background: var(--secondary);
}

.projectNavSlider::before{
    background: var(--gray);
}

.projectNavSlider .slick-slide:not(.slick-current){
opacity: 0.3;
}

/*END OF TIMELINE SLIDER*/

/*CAREER PAGE*/
.modal-header .close{
    position: absolute;
    right: 17px;
    top: 17px;
    background: white;
    line-height: 1;
    padding: 10px 15px;
    opacity: 0.75;
}
.thumbItem{
    /*border-radius: 1.5em;*/
    overflow: hidden;
    /*margin-bottom: 2em !important;*/
    position: relative;
}

.thumbItem aside{
    text-align: center;
    background: var(--danger);
    color: var(--white);
    height: 60px;
    padding: 0 1em;
}

.customModal .modal-dialog {
    overflow: hidden;
    border-radius: 1.5em;
}

.customModal button.close{
    opacity: 1;
    line-height: 1em;
    padding: 0;
    margin: 0;
    font-size: 2em;
}

.customModal button.close span{
    line-height: 1em;
}

.table-responsive table{
    margin-bottom: 35px;
}
.table-responsive{
    overflow-y: hidden;
    position: relative;
}

.table-hover tbody tr:hover{
    background-color:none !important;
}

.table-responsive .viewTable{
    position: absolute;
    bottom: 0;
    z-index: 2;
    /* left: 50%;
    -moz-transform:translate(-50%);
    -ms-transform:translate(-50%);
    -webkit-transform:translate(-50%);
    transform: translate(-50%); */
    height: 75px;
}

.table-responsive .viewTable:not(.expanded) i{
    position: absolute;
    bottom: 0;
}
/* 
@media only screen and (max-width: 767px) {
    .border.embed-responsive-1by1.whiteBox:after{
        content: "";
        height: 40px;
        width: 100%;
        bottom: 0;
        left: 0;
        position: absolute;
        z-index: 1;
    }
} */

/* .border.embed-responsive-1by1.whiteBox:after, */

.table-responsive:not(.expanded) .viewTable{    
    background: rgba(255,255,255,0);
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 0%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.95) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(0%, rgba(255,255,255,0)), color-stop(50%, rgba(255,255,255,0.95)), color-stop(100%, rgba(255,255,255,0.95)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 0%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.95) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 0%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.95) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 0%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.95) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 0%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.95) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0 );
}

.table-responsive a[data-toggle="collapse"]+div{
    font-size:0.95em;
}

.table-responsive a[aria-expanded="true"]{
    font-family: 'medium';
}

table.courses{
    border: 2px solid var(--primary);
    margin: 0;
    text-align: center;
}

table.courses td{
    position: relative;
}

table.courses img{
    width: 100px;
    margin: auto;
}

.customModal .modal-footer {
    padding-left: 1.5em;
    padding-right: 1.5em;
}

.pt-10{padding-top: 10%; }
.pt-20{padding-top: 20%; }
.pt-30{padding-top: 30%; }
.pt-40{padding-top: 40%; }
.pt-50{padding-top: 50%; }
.pt-60{padding-top: 60%; }
.pt-70{padding-top: 70%; }
.pt-80{padding-top: 80%; }
.pt-90{padding-top: 90%; }
.pt-110{padding-top: 110%; }
.pt-120{padding-top: 120%; }
.pt-130{padding-top: 130%; }
.pt-140{padding-top: 140%; }

.textOverImage{
    position: relative;
    margin-bottom: 2em;
    text-align: center;
}
.textOverImage aside{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.textOverImage aside h5,
.textOverImage aside h6{
    font-size: 1.35em;
    text-transform: uppercase;
}

.img-inline{
    float: right;
    width: 50%;
    padding-left: 20px;
    padding-bottom: 20px;
}

.coursePopup .borderLeft{
    border-left: 1px solid;
}
@media only screen and (max-width: 998px) {
    .coursePopup .borderLeft{
        border: none;
    }

    .text-dark.text-nowrap{
        white-space: normal !important;
    }
}

@media only screen and (max-width: 767px) {
    .thumbItem aside{
        height: 50px;
    }

    .thumbItem aside > h5{
        font-size: 0.875em;
    }

    .img-inline{
        float:none;
        padding-left: unset;
        width: 100%;
    }
}
/*END OF CAREER PAGE*/

/*CAREER CARD SLIDER*/
.careerSlider{
    height: 350px;
    width: 350px;
    margin: auto;
    overflow: visible;
    margin-right: 0px;
}

.cardslider-cards{
    opacity: 1;   
    width: 100%;
    height: 100%;
    top: 30px;
    transform: none;
    left:0;
}

.cardslider-card{
    background:transparent;
    border-radius: 1.5em;
}

.cardslider-card[aria-hidden="false"]{
    z-index: 99 !important;
}

.cardslider-direction-nav{
    right:-50px;
    bottom: unset;
    top: 50%;
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    transform: translateY(-50%);
    z-index: 99;
    display: none;
}

.cardslider.direction-down .card-1 {
    -moz-transform: scale(0.95) translateY(-6.31%);
    -ms-transform: scale(0.95) translateY(-6.31%);
    -webkit-transform: scale(0.95) translateY(-6.31%);
    transform: scale(0.95) translateY(-6.31%);
}
.cardslider.direction-down .card-2 {
    -moz-transform: scale(0.9) translateY(-12.61%);
    -ms-transform: scale(0.9) translateY(-12.61%);
    -webkit-transform: scale(0.9) translateY(-12.61%);
    transform: scale(0.9) translateY(-12.61%);
}
.cardslider.direction-down .card-3 {
    -moz-transform: scale(0.85) translateY(-18.91%);
    -ms-transform: scale(0.85) translateY(-18.91%);
    -webkit-transform: scale(0.85) translateY(-18.91%);
    transform: scale(0.85) translateY(-18.91%);
}

.cardslider-direction-nav .cardslider-nav-next:active,
.cardslider-direction-nav .cardslider-nav-prev:active,
.cardslider-direction-nav .cardslider-nav-next,
.cardslider-direction-nav .cardslider-nav-prev{
    border: none;
    background:var(--light-gray) ;
    transform: none;
    width: 35px;
    height: 35px;
    position: relative;
    text-indent: 0;
}

.cardslider-direction-nav .cardslider-nav-next:hover,
.cardslider-direction-nav .cardslider-nav-prev:hover{
    background: #FFFFFF;
}
.cardslider-nav-prev:after,
.cardslider-nav-next:after{
    content: "\f106";
    font-family: "FontAwesome";
    font-size: 1.5em;
    position: absolute;
    top: 48%;
    left: 50%;
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.cardslider-nav-prev:after{
    content: "\f107";
    top: 50%;
}

@media only screen and (max-width: 840px) {
    .cardslider-direction-nav{
        right:-18px;
    }
}

@media only screen and (max-width: 767px) {
    .cardslider-direction-nav{
        right:-45px;
    }
}

@media only screen and (max-width: 350px) {
    .cardslider-direction-nav{
        right:-18px;
    }
}
/*CAREER CARD SLIDER*/
/* .content ol,
.content ul:not(.nav-tabs){
    margin-left:1.4em;
}

.content ul:not(.nav-tabs) li{
    list-style: disc;
    padding-left: .5em;
    margin-bottom: .5em;
} */

.content ol,
.content ul{
    margin-left: 2em !important;
}

.content ul.fa-ul{
    margin-left: 2.5em !important;
}

.content ul li{
    list-style: disc;
} 

.content ul li,
.content ol li{
    padding-left: .5em;
    margin-bottom: .5em;
}

.content p+ul,
.content p+ol{
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}

p+.btn,
.content ol+p,
.content ul+p{
    margin-top: 1.5em;
}

.content ul.fa-ul li{
    list-style: none;
}

.content h6+ul{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.content p+h6{
    margin-top: 1.5em;
}

.p-accreditations .slick-track .slick-slide{
    position: relative;
}

.p-accreditations .slick-track .slick-slide:after{
    display: none;

}

.p-accreditations .slick-track .slick-active:not(:last-child):after{
    content: "";
    position: absolute;
    right: -2px;
    top:0;
    height: 100%;
    width: 0;
    border-right: 2px dotted var(--gray);
    display: block;
}

.lineRight{
    position: relative;
    overflow: hidden;
}

.lineRight:after{
    content: "";
    margin-left:10px;
    position: absolute;
    top:50%;
    transform:translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    width:100%;
    height: 1px;
    background:var(--gray);
}

@media only screen and (max-width: 767px) {
    .lineRight{
        padding-bottom: .75em;
        margin-bottom: 1em;
        text-align:center;
        text-transform: uppercase;
        position: relative;
    }

    .lineRight:after{
        content: "";
        width: 150px;
        height: 5px;
        position: absolute;
        left: 50%;
        bottom: 0;
        top: unset;
        margin: 0;
        transform:translateX(-50%);
        -ms-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        background-color: var(--gray);
    }
}

.relatedfieldsSlider .slick-track,
.relatedDegreesSlider .slick-track,
.relatedCareer .slick-track,
.relatedfieldsSlider .slick-track{
    padding: 2em 0;
}


/* COURSE DETAILS */
.courseDetailsTab,
.scrtabs-tab-container{
    margin-bottom: 15px !important;
}

.courseDetailsTab{
    border: none;
}

.courseDetailsTab li:not(:last-child) .btn{
    margin-right: 10px;
}
.courseDetailsTab .btn{
    border: none;
    border-radius: 0;
    position: relative;
}

.thumbnailTabs a.active .quaternaryBox:after,
/* .thumbnailTabs .slick-current.slick-active .quaternaryBox:after, */
.themeTab a.nav-link{
    min-width: 150px;
    text-align: center;
}
.themeTab a.nav-link.active:after,
.courseDetailsTab a.active.btn:after{
    content: "";
    position: absolute;
    bottom: -13px;
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 15px solid var(--danger);
    z-index: 1;
    left: 50%;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

.alert-custom{
    border: 2px solid var(--quaternary);
    border-radius: 0;
    position:relative;
    padding-top: 2em;
    padding-bottom: 2em;
    margin: 20px 0 40px;
    background: var(--quinary);
    color: var(--white);
}

.alert-custom:not(.lg) a{
    color: var(--white);
}

.alert-custom p a{
    color: var(--white);
    text-decoration: underline;
}

.alert-custom.lg{
    border: none;
    color: var(--primary);
    font-family: 'Medium' !important;
    font-size: 1.5em;
    padding-top: 1.2em;
    padding-bottom: 1.2em;
    line-height: 1.25em;
    background-image: url('../images/theme-bg.png');
    background-repeat: no-repeat;
    background-position: center right;
    margin-bottom: 30px;
} 

.alert-custom.lg a{
    color: var(--primary);
}

.alert-custom.lg .btn{
    position: relative;
    margin:0;
}

.alert-custom.lg.withCTA{
    padding-bottom: 2em;
}

div > .h3:first-child,
div > .h4:first-child,
div > .h5:first-child,
div > h3:first-child,
div > h4:first-child,
div > h5:first-child,
div > .alert-custom:first-child{
    margin-top: 0;
}

.withCTA{
    padding-bottom: 3em;
}

.alert-custom .btn{
    position: absolute;
    bottom: -15px;
    margin-left: 10px;
    margin-right: 10px;
}

.alert-custom .btn::before,
.alert-custom .btn::after{
    content:"";
    width: 15px;
    height: 10px;
    background-color: var(--quinary);
    position: absolute;
    left: -20px;
    /* top:10px; */
}

.alert-custom .btn::after{
    left: unset;
    right: -20px;
}

.intakes i[class*="fac-"]{
    font-size:20px;
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translate(-50%,-50%);
    top: 50%;
}

.intakes td:first-child{
    position: relative;
    padding: 0 10px 0 20px;
}

.courseDetais ul{
    margin: 0;
}

.courseDetais ul li{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.thumbnailTabs .slick-arrow{
    top: calc(50% - 9px);
}
.thumbnailTabs a.active .quaternaryBox{
    background: var(--danger);
    position: relative;
    overflow: visible;
}

.themeAccordion .card-header .btn{
    position: relative;
    text-transform: none;
    padding-right:40px;
}

.themeAccordion .card{
    margin-bottom: 1em;
    border-bottom: 1px solid rgba(0,0,0,.125) !important;
    border-radius: 0 !important;
}

.themeAccordion .card-header .btn i{
    position: absolute;
    right: 1em;
    top: 50%;
    transform: translateY(-50%);
}

.themeAccordion .card-header .btn[aria-expanded="true"] i:before{
    content:"\f068";
}

@media (min-width: 576px) {
    ul.ul2Cols {
        columns: 2;
        -webkit-columns: 2;
        -moz-columns: 2;
    }
}

ul.ul2Cols li{
    margin-bottom: 0 !important;
}

@media (max-width: 767px) {
    .courseDetais{
        padding-bottom: 1.5em !important;
    }    
    .courseDetais h6{
        margin-top: 1em;
    }
}

@media (max-width: 1199px) {
    .courseDetailsTab {
        display: block;
        /* overflow-x: auto; */
        padding-bottom: 20px;
        white-space: nowrap;
    }

    .courseDetailsTab li:not(:last-child){
        margin-right: 0;
    }

    .courseDetailsTab li a.btn{
        margin-right: 0 !important;
    }

    
}

@media (max-width: 480px) {

    .relatedfields h6{
        font-size: 0.9em;
    }
}

.border-bottom.dashed{
    border-bottom-style: dashed !important;
}

.whiteBox h6{
    font-size: 0.9em !important;
}

.modal-dialog .relatedfields h6{
    font-size: 0.85em !important;
}

.modal-xl {
    max-width: 1200px;
}

@media (max-width: 600px) {
    .modal-dialog .relatedfields img{
        width: 50%;
    }
}

@media (max-width: 400px) {
    .modal-dialog .whiteBox .embed-responsive-item,
    .modal-dialog .primaryBox .embed-responsive-item,
    .modal-dialog .secondaryBox .embed-responsive-item,
    .modal-dialog .tertiaryBox .embed-responsive-item,
    .modal-dialog .quaternaryBox .embed-responsive-item,
    .modal-dialog .dangerBox .embed-responsive-item{
        padding: .25em;
    }

    .modal-dialog .relatedfields .col{
        padding-right: 5px;
        padding-left: 5px;
    }

    .modal-dialog .relatedfields .col >div:first-child{
        margin-bottom:1em;
    
    }

    .modal-dialog .relatedfields img{
        width: 40%;
    }
}

.bullet{
    position: relative;
    padding-left:15px;
    display: inline-block;
    color: var(--white);
    margin-bottom: 5px;
}

.bullet:after{
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--danger);
    left: 0;
    border-radius: 10px;
}

/*END OF COURSE DETAILS*/

.btn-primary:after{
    border-top-color: var(--primary) !important;
}

.btn-secondary:after{
    border-top-color: var(--secondary) !important;
}

.btn-tertiary:after{
    border-top-color: var(--tertiary) !important;
}

.btn-quaternary:after{
    border-top-color: var(--quaternary) !important;
}

.btn-quinary:after{
    border-top-color: var(--quinary) !important;
}

.btn-danger:after{
    border-top-color: var(--danger) !important;
}

.scrtabs-tab-scroll-arrow{
    height: 38px;
    padding-top: 15px;
    background:rgba(0, 0, 0, 0.075);
    border: none;
}


/* @media (min-width: 1200px) {
    .courseDetailsTab > .nav-link,
    .courseDetailsTab .nav-item {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    text-align: center;
    }
} */


.hoverIcon{
    opacity: 0;
}

.hoverIcon:hover{
    opacity: 1;
}

@media (max-width: 575px) {
    .hoverIcon{
        opacity: 1;
    }
}

.hoverIcon i{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    color: var(--white);
}
/* END OF COURSE DETAILS*/
.floatingIconContainer{
    position:fixed;
    bottom:80px;
    right:20px;
    z-index:999999;
}

.floatingIcon{
    width: 55px;
    height: 55px;
    margin-top: 10px;
    display: block;
    border: 2px solid var(--danger);
    border-radius: 50%;
    position: relative;
    /* background: rgba(255,255,255,0.9); */
}
/* 
.floatingIcon:hover{
    background: rgba(255,255,255,1);
} */

.floatingIcon i{
    font-size: 2em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    color: var(--danger);
}
.floatingIcon.whastapp { border-color:#25d366; }
.whastapp i{ color: #25d366; }

.floatingIcon.phone { border-color: var(--tertiary); }
.phone i{ color: var(--tertiary); }

@media (max-width: 767px) {
    .floatingIconContainer{
        right: 15px;
        bottom: 140px;
        /* iska */
    }
}

/* DRUPAL TOOL BAR */
.toolbar-tray-open #mainNav{
    position: absolute !important;
}

.toolbar-tray-open .main{
    position: relative;
}

.toolbar-tray-open .toolbar-bar {
    z-index: 10000;
}
/* END OF DRUPAL TOOL BAR*/

/*ACADEMIC STAFF*/

.profileBox > div{
    margin-bottom: 2em;
    /* background: var(--tertiary);
    color: var(--white); */
    width: 100%;
}

.profileBox > div .cta{
    padding-top: 1em;
}

.profileBox aside p {
    margin-bottom: 10px;
}
.profileBox aside a.btn {
    margin-top: auto;
}

.themeTab.nav-tabs {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 1px;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;

}

.themeTab li:not(:last-child){
    margin-right: 0 !important;
}

.themeTab li:first-child{
    padding-left: 0; 
}

.themeTab{
    margin-bottom: 15px;
    height: 60px;
}

.themeTab li a.nav-link{
    color: var(--white);
    background: var(--light-gray);
    border-radius: 0;
}

.themeTab li a.nav-link.active{
    background: var(--danger) ;
    color: var(--white);
    border: 1px solid transparent;
    position: relative;
    
}

.themeTab a.active.bg-dark:after{ border-top-color: var(--dark);}
.themeTab a.active.bg-primary:after{ border-top-color: var(--primary);}
.themeTab a.active.bg-secondary:after{border-top-color: var(--secondary);}
.themeTab a.active.bg-tertiary:after{border-top-color: var(--tertiary);}
.themeTab a.active.bg-quaternary:after{border-top-color: var(--quaternary);}
.themeTab a.active.bg-quinary:after{border-top-color: var(--quinary);}
.themeTab a.active.bg-senary:after{border-top-color: var(--senary);}

.hashDst{
    position: relative;
}
.offsetFixSpan {
    position: absolute !important;
    top: -140px !important;
}

.slidePlaceholder{
    background: rgba(0,0,0, 0.5);
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: none;
}

.slidePlaceholder img{
    position: absolute; 
    width: 50px; 
    z-index: 1;
    top: 50%; 
    transform: translate(-50%,-50%); 
    left: 50%;
}
/*ACADEMIC STAFF*/

.content .pagination{
    list-style: none !important;
    margin: auto !important;
    padding: 0 !important;
    text-align: center;
    width: auto;
    display: block;
}

.content .pagination li{
    list-style: none !important;
    display: inline-block;
    padding:0;
}


/*GALLERY PAGE*/
@media (max-width: 991px) {
    .currentVideo .bg-cover-absolute{
        position: relative;
    }

}

@media (max-width: 575px) {
    .gallery .col{
        margin-bottom: 30px;
    }
    .gallery .videoItem:after{
        display: none;
    }

    .gallery .videoItem:before{
        z-index: 3;
    }

    .gallery .videoItem{
        margin:0; 
        background:var(--primary);
        height:100%
    }

    .gallery .videoItem aside{
        height:auto;
        background:var(--primary);
    }

    .gallery .videoItem aside p{
        width: 100%;
    }
}

.currentVideo{
    position: relative;
}

.fancybox-caption{ text-align:center; border:none; }
.fancybox-thumbs{ background:#000; }

@media (max-width: 767px) {
    .fancybox-button--share,
    .fancybox-button--play{
        display: none;
    }
    .fancybox-toolbar .fancybox-button.fancybox-button{
        width: 60px;
        height: 60px;
    }
}

.d-flex .lead{
    width: 100%;
}

.videoItem::after{
    content: "";
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0; 
    background: rgba(255,255,255,0);
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(60%, rgba(153,153,153,0)), color-stop(100%, rgba(0,0,0,0.9)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#333333', GradientType=0 );
}

.videoItem::before{
    content: "";
    position: absolute;
    height: 5px;
    background: var(--danger);
    width: 100%;
    left: 0;
    bottom: 0;
    z-index:2;
    opacity: 0;
}

.videoItem.active::before{
    opacity: 1;
}

.bottomGradient::after{
    content: "";
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0; 
    background: rgba(255,255,255,0);
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(60%, rgba(153,153,153,0)), color-stop(100%, rgba(0,0,0,0.9)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(153,153,153,0) 60%, rgba(0,0,0,0.9) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#333333', GradientType=0 );
}

.contactIcons [class^="fas"] {
    width: 30px;
}

hr.gray{
    border-top: 1px solid var(--dark-gray);
}

@media (max-width: 767px) {
    .contactBoxes .rectangleBox{
        padding: 20px 10px;
    }

    .contactBoxes .bg-cover-absolute{
        position: relative;
    }
    .borRightDash {
        border-right: none !important;
    }
}

.grayscaled{
    -webkit-filter: grayscale(100%); 
   -moz-filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   -o-filter: grayscale(100%);
    filter: grayscale(100%);
}
/*STEP WIZARD*/
.stepwizard-step p {
    margin: 10px 0;
    color:#666;
}
.stepwizard-row {
    display: table-row;
}
.stepwizard {
    display: block;
    width: 100%;
    position: relative;
}

.stepwizard .btn.disabled {
    opacity: 1;
    background: #bbbbbb !important;
    color:#FFFFFF;
}
.stepwizard .row:before {
    top: 20px;
    bottom: 0;
    position: absolute;
    content:" ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-index: 0;
}
.stepwizard-step {
    text-align: center;

}
.btn-circle {
    width: 40px;
    height: 40px;
    min-width: unset;
    text-align: center;
    padding: 6px 0;
    font-size: 20px;
    line-height: 1.428571429;
    border-radius: 20px;
}
/*END OF STEP WIZARD*/
.res-dts-team {
    min-height: 196px;
}
.res-dts-team ul {
    margin-top: 3px;
}
.res-dts-team h5 {
    font-size: 15px;
}
.card-columns .table-responsive {
    border-radius: 5px;
    margin-bottom: 1rem;
}
.card-columns .table-responsive>.table-bordered {
    border: 2px solid var(--quaternary);
    margin-bottom: 0;
}
.card-columns .table-responsive table thead {
    background: var(--quaternary);
}
.card-columns .table thead th {
    border-bottom: 2px solid var(--quaternary);
}
.card-columns .table-bordered td, .table-bordered th {
    border: 1px solid var(--white);
}
.card-columns .table-striped tbody tr:nth-of-type(2n+1) {
    background-color: #d5e1fd;
}
.card-columns .table-striped tbody tr {
    background-color: #e6eeff;
}
/*22-07-2021-updates*/
/* 
#block-uowd-local-tasks,
#block-uowd-content{
    width: 90%;
    max-width: 500px;
    margin: auto;
}

#block-uowd-local-tasks{  margin-top: 50px;margin-bottom: 10px;border-bottom: 2px solid var(--gray);padding-bottom: 20px;}
#block-uowd-content{ margin-bottom: 50px;}
#block-uowd-local-tasks ul li { display: inline-block; }
#block-uowd-local-tasks ul li:nth-last-child(1){ float: right}
#block-uowd-local-tasks ul li a{ 
font-weight: 400;
color: #212529;
text-align: center;
vertical-align: middle;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
padding: .375rem .75rem;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
font-size: 1rem;
line-height: 1.5;
border-radius: .25rem;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    background: var(--danger) !important;
    min-width: 110px;
    text-align: center;
    color: var(--white) !important;
    border: none !important;
    border-radius: 0;
}

#block-uowd-content .form-item +p,
#block-uowd-content .form-item .description{ font-size: 12px; padding: 5px 0;} */

.lazy-hidden{opacity:0}.lazy-loaded{-webkit-transition:opacity .3s;-moz-transition:opacity .3s;-ms-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s;opacity:1}

video{opacity: 1 !important;}


/*-- Newly Added --*/
#ComputerScience {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/cs-bg.jpg');   
    background-size: cover;
}
#BusinessCommerce {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/business-bg.jpg');   
    background-size: cover;
}
#Engineering {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/engineering-bg.jpg');   
    background-size: cover;
}
#Healthcare {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/healthcare-bg.jpg');   
    background-size: cover;
}
#InformationTechnology {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/it-bg.jpg');   
    background-size: cover;
}
#MediaDesign {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/media-bg.jpg');   
    background-size: cover; 
}
#Education {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/education-bg.jpg');   
    background-size: cover; 
}
#PoliticalScience {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/pol-sci-bg.jpg');   
    background-size: cover;
}
#SocialScience {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/socialscience-bg.jpg');   
    background-size: cover;
}

.newHeaderStyle h1 {
    margin: 15px 0px;
    padding: 15px;
    background: #0c2340;
    color: #fff;
}

/**Degrees Background**/

#BachelorsSty {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/bachelors-bg.jpg');   
    background-size: cover;
}
#MastersSty {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/masters-bg.jpg');   
    background-size: cover;
}
#DoctorateSty {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/doctors-bg.jpg');   
    background-size: cover;
}
#EnglishTestingSty {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/english-testing-bg.jpg');   
    background-size: cover;
}
#ShortCoursesSty {
    background: linear-gradient(0deg, rgba(0, 21, 66, 0.5), rgba(0, 21, 66, 0.5)), url('/themes/uowd/images/boxf/short-courses-bg.jpg');   
    background-size: cover;
}

.py-160 {
    padding-top: 160px ;
    padding-bottom: 160px ;
}
.VideoBG {
    height: 950px; 
    margin-top: -250px
}
.carousel-inner p {
    font-size: 18px;
    line-height: 30px;
    text-align: center;
}

.hvr-grow-slider{
    width: 100%;
}

.widgetBtn {
    width: 140px;
    margin: auto;
}

.widgetBtnSpc {
    min-height: 21px;
}

.homeWidgBig {
    font-size: 22px;
    line-height: initial;
    min-height: 60px;
}
.bg-blue {
    background:#0c2340;
}
.txtCenter {
    text-align: center;
}
.txtCenter p.lead.medium strong {
    font-size: 20px;
}
.txtCenter img {
    width: 38%;
    margin: 10px;
    filter: brightness(0) invert(1);
}
.borRightDash {
    border-right: 1px dashed #ffffff;
}

/*Program Structure Tabs*/

ul#myTab {
    margin-left: 0px !important;
    margin-bottom: 0px;
}

ul#myTab li {
    list-style: none;
}

ul#myTab li a {
    font-weight: bold;
    padding: 10px 30px;
    border-color: #e9ecef #e9ecef #dee2e6;
}

ul#myTab.nav.nav-tabs li.nav-item a.nav-link.active {
    border-color: #dee2e6 #dee2e6 #fafafa;
    background: #fafafa;
}
div#myTabContent {
    background: #fafafa;
    padding: 15px;
}

@media only screen and (max-width:440px) {
        ul#myTab li a {
        padding: 5px 10px;
    }
    ul#myTab.nav.nav-tabs li.nav-item a.nav-link.active {
        padding-top: 10px !important;
    }
}